<template>
  <div class="containers">
   <div class="container">
     <div class="form-box" style="width: 100%;max-width: 900px;">
       <el-tabs >
         <el-tab-pane label="支付宝支付设置" >
           <el-form ref="form"  label-width="120px">

             <el-form-item label="类型">
               <el-select v-model="form.types" @change="getData()" placeholder="请选择类型" size="small">
                 <el-option label="app" :value="0"> </el-option>
                 <el-option label="h5" :value="1"> </el-option>
               </el-select>
             </el-form-item>
             <el-form-item label="是否开启">
            <el-switch :active-value="1" :inactive-value="0" v-model="form.is_open"></el-switch>
          </el-form-item>
             <el-form-item label="appID">
               <el-input v-model="form.appid"></el-input>
             </el-form-item>
             <!-- <el-form-item label="销售产品码">
               <el-input v-model="form.product_code"></el-input>
               商家和支付宝签约的产品码。手机网站支付为：QUICK_WAP_WAY
             </el-form-item> -->
               <el-form-item label="app_cert_sn">
               <el-input v-model="form.app_cert_sn" disabled></el-input>
             </el-form-item>
              <el-form-item label="alipay_root_cert_sn">
               <el-input v-model="form.alipay_root_cert_sn" disabled></el-input>
             </el-form-item>
             <el-form-item label="回调URL">
               <el-input v-model="form.notifyUrl"></el-input>
             </el-form-item>
              <el-form-item label="应用公钥证书">
               <input type="file" ref="filElem2" @change="onChange2">
             </el-form-item>
              <el-form-item label="支付宝根证书">
               <input type="file" ref="filElem3" @change="onChange3">
             </el-form-item>
             <el-form-item label="上传文件">
               <input type="file" ref="filElem" @change="onChange">
             </el-form-item>
             <el-form-item>
                 <el-button type="primary" @click="setlv()">确 定</el-button>
             </el-form-item>
           </el-form>
         </el-tab-pane>
       </el-tabs>
     </div>
   </div>
 </div>
</template>

<script>
export default {
   name: 'ShibangHtRelease',

   data() {
       return {
         apiclient_key:'',
           form:{
            types:0,
            is_open:0,
            appid:'',
            secret:'',
            merchant:'',
            serial:'',
            v3:'',
            apiclient_key:'',
            code:"1",
            notifyUrl:'',
            product_code:'',
            app_cert_sn:'',
            alipay_root_cert_sn:'',
            alipayRootCert:'',
            appCertPublicKey:''
           },
           upimg: {
           token: '',
           key: new Date().valueOf()
           },
           upload:'',
           formdata:'',
       };
   },
   created(){
       this.getData()
   },
   mounted() {
       this.formdata = new FormData()
   },

   methods: {
       onChange(event) {
         console.log(event,'5555')
         var that = this;
         const inputFile = this.$refs.filElem.files[0];

         this.form.apiclient_key = inputFile
        //  this.formdata = new FormData()
         this.formdata.append('appid', that.form.appid)
         this.formdata.append('is_open', that.form.is_open)
         this.formdata.append('product_code', that.form.product_code)

         this.formdata.append('notifyUrl', that.form.notifyUrl)
         if(inputFile){
           this.formdata.append('zhifubao', that.form.apiclient_key)
           this.formdata.append('code', that.form.code?1:1)
           that.form.code=1
         }else{
          that.form.code=0
           this.formdata.append('code', that.form.code?0:0)
         }
       },
       onChange2(event) {
         console.log(event,'5555')
         var that = this;
         const inputFile2 = this.$refs.filElem2.files[0];
         this.form.appCertPublicKey = inputFile2
        //  this.formdata = new FormData()
        //  this.formdata.append('appid', that.form.appid)
        //  this.formdata.append('is_open', that.form.is_open)
        //  this.formdata.append('product_code', that.form.product_code)

        //  this.formdata.append('notifyUrl', that.form.notifyUrl)
         if(inputFile2){
           this.formdata.append('appCertPublicKey', that.form.appCertPublicKey)
           this.formdata.append('code1', that.form.code?1:1)
           that.form.code=1
         }else{
          that.form.code=0
           this.formdata.append('code2', that.form.code?0:0)
         }
       },
       onChange3(event) {
         console.log(event,'5555')
         var that = this;
         const inputFile3 = this.$refs.filElem3.files[0];
         this.form.alipayRootCert = inputFile3
        //  this.formdata = new FormData()
        //  this.formdata.append('appid', that.form.appid)
        //  this.formdata.append('is_open', that.form.is_open)
        //  this.formdata.append('product_code', that.form.product_code)

        //  this.formdata.append('notifyUrl', that.form.notifyUrl)
         if(inputFile3){
           this.formdata.append('alipayRootCert', that.form.alipayRootCert)
           this.formdata.append('code3', that.form.code?1:1)
           that.form.code=1
         }else{
          that.form.code=0
           this.formdata.append('code3', that.form.code?0:0)
         }
       },
         // 上传图片
       handleAvatarSuccess(res, file) {
         this.form.apiclient_key = this.url + res.key;
         this.apiclient_key = URL.createObjectURL(file.raw);
       },
       beforeupload(file) {
         let types = file.name.split('.')//获取图片格式
         this.upimg.key = this.$template+'/wxpay/' + new Date().valueOf() + '.' + types[types.length-1];
       },
       setlv() {
         const inputFile = this.$refs.filElem.files[0];
         if(this.form.code==1&&inputFile==undefined){
             this.$message.error('请上传文件');
             return
         }

        let updata=this.form
         this.$http({
         url:  `${this.mainurl}admin/aliPaySet/?types=${updata.types}&code=${inputFile==undefined?0:1}&notifyUrl=${updata.notifyUrl}&appid=${updata.appid}&is_open=${updata.is_open}&product_code=${updata.product_code}`,
         method: 'post',
         headers: {
           'Content-Type': 'multipart/form-data',
           'token': localStorage.getItem('admin_token_sys')
         },
         data: this.formdata,
         dataType: "json",
         cache: false, //上传文件无需缓存
         processData: false, //用于对data参数进行序列化处理 这里必须false
         contentType: false, //必须
       }).then(res => {
         this.$message.success(res.data.errmsg)
         this.getData()
       })
       },
       getData(){
        let types=this.form.types
            this.request('admin/aliPaySet/?types='+types, 'GET').then(res => {
           // if(){
               this.form = res.data
                this.form.types=types
                this.form.code=0
           // }
       })
       }
   },
};
</script>

<style lang="scss" scoped>

</style>
